<template>
  <view class="dateMainBox">
    <view class="leftBox">
	  <!-- 自定义时间范围选择器 -->	  
	  <picker
		
	    :mode="modeType"
	    :value="placehold"
	    :start="startDate"
	    :end="endDate"
	    @change="bindDateChange"
	  >
	    <view class="uni-input">{{ date }}</view>
	  </picker>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    pickerType: {
      type: String
    },
	mark:{
		type:String
	},
	modeType:{
		type:String,
		default:"date"
	}
  },
  data() {
    const currentDate = this.getDate({
      format: true
    })
    return {
      placehold: '请输入开始时间',
      imgSrc: require('../../static/img/request/time.png'),
	  rightImg:require('../../static/img/request/rightArrow.png')
    }
  },
  mounted() {
    // 获取当前时间
    this.placehold = this.pickerType == 'start' ? '请选择开始时间' : '请选择结束时间'
  },
  watch: {
    date(newValue, oldValue) {
      console.log('newValue', newValue)
    }
  },

  computed: {
    startDate() {
      return this.getDate('start')
    },
    endDate() {
      return this.getDate('end')
    }
  },
  methods: {
    bindDateChange: function(e) {
      this.date = e.target.value
      this.$emit('selectDate', {
        date: e.target.value,
        pickerType: this.pickerType
      })
    },
    getDate(type) {
      const date = new Date()
      let year = date.getFullYear()
      let month = date.getMonth() + 1
      let day = date.getDate()

      if (type === 'start') {
        year = year - 60
      } else if (type === 'end') {
        year = year + 2
      }
      month = month > 9 ? month : '0' + month
      day = day > 9 ? day : '0' + day
      return `${year}-${month}-${day}`
    }
  }
}
</script>

<style lang="scss">
.dateMainBox {
  // background: #BBBBBB;
  
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: center;
  // border-radius: 80rpx;
  height: 100rpx;
  .leftBox {
    display: flex;
	align-items: center;
	.uni-input {
	  font-size: 26rpx;
	  // color:#C8C7CC
	}
  }
  .rightBox {
    // background-color: #4CD964;
    height: 70rpx;
    line-height: 70rpx;
  }
  
}
</style>
